簡單聊聊本系列文的選題動機，以及預計的開展方向。期待能由淺入深剖析各種 bundler、build tool 如 Webpack、Vite (Rollup/Rolldown)、esbuild、Rspack、Turbopack 等工具的特性與優缺點，並通過實際弄髒手做實驗的方式來理解它們的運作原理與實戰技巧。
嗨，大家好，最後還是想不開來參加 IT 鐵人賽了。
第一篇不免俗讓我廢話一下聊聊選題動機，關於主題其實幾個月前有各種想法：
這三個主題寫起來應該都蠻有趣的，其實前兩個對我來說是更能掌握的主題，但最後卻是在昨天洗澡時突然有個靈感，不如就來研究第三個主題中的 bundler 好了，如果研究有成可能有機會完成「向某個 Rust-based bundler 發 PR」這樣遠大的目標。
會想寫這個主題是因為近幾年看到許多前端工具都從 Javascript/TypeScript 被 Rust 化，而今年初時其實曾寫過一個關於 Tree shaking 的系列文，其中有個缺憾是草稿與筆記中一直有一塊想來寫寫近代 bundler 的研究，但沒想到這個 WIP 就像是程式碼中的 TODO 一樣，大多如果你 git blame 下去可能都是好幾年前的 commit，空有想法不執行最後終究只是觀眾，不如就趁今年鐵人賽的機會來推進一下。
另外上個月剛好也看到 Rspack 1.0 正式發佈的消息，一直知道這是個由 ByteDance Infra team 開發的 Rust-based bundler，仔細一看才發現原來它其中一個特性是能做到兼容 Webpack，好像也蠻值得來實際研究看看的，如果有機會幫到目前團隊或正打算做大型專案中的 Webpack 遷移的開發者們實是好事一件。
理想很遠大，但現實是骨感的，沒存稿的狀況下之後忙起來不知道能不能持之以恆，但或許這就是參加鐵人賽之所以有挑戰的一個原因。另外還有個預防針是其實我完全沒寫過任何一行 Rust 程式，說不定中途還會出現一些必須弄懂才能繼續前進的 Rust 學習筆記，但就先且戰且走了，寫一篇是一篇。
這系列因為算是做中學，期待在一些前情提要後，能以弄髒手實際做幾個實驗來學習，若過程中有錯誤再請各位讀者不吝指正，若有興趣也可以訂閱追蹤一起討論！
iThome鐵人賽
看影片追技術